<template>
    <div class="info-item" @click="avatarFn">
        <span>{{title}}</span>
        <div class="info-det">
            <span v-if="nickname">{{nickname}}</span>
            <img style="width:37px;height:37px" v-if="avatar" :src="avatar" alt />
            <span>></span>
        </div>
    </div>
</template>

<script>
export default {
    props:{
        title:{
            type:String,
        },
        avatar:{
            type:String,
        },
        nickname:{
            type:String,
        },
    },
    data() {
        return {

        };
    },
    created() {

    },
    methods: {
        avatarFn(){
            this.$emit('avatarFun')
        }
    },
};
</script>

<style lang="scss" scoped>
.info-item {
    width: 720px;
    height: 85px;
    padding: 0 15px;
    display: flex;
    font-size: 20px;
    color: #999;
    justify-content: space-between;
    align-items: center;

    .info-det {
        display: flex;
        align-items: center;

        span {
            margin-left: 15px;
        }
    }
}
</style>
